<template>
  <div class="dashboard-container">
    <div class="app-container">
      <el-card shadow="never">

        <!-- 顶部筛选表单 -->
        <screenSubForm  :subjectIDList="subjectIDList" @getChildScreenForm="getScreenForm"></screenSubForm>

        <screenSubTable ref="SubTable" :subjectIDList="subjectIDList" :screenForm="screenForm" ></screenSubTable>
      </el-card>
    </div>
  </div>
</template>

<script>

// 导入获取简单学科列表api
import { simple } from '@/api/hmmm/subjects'

// 导入封装的组件
import screenSubForm from '../components/screen-subForm.vue'
import screenSubTable from '../components/screen-subTable.vue'

export default {
  components: {
    screenSubForm,
    screenSubTable
  },
  data () {
    return {
      subjectIDList: [], // 学科渲染简单列表
      screenForm: {} // 用户筛选对应的表单
    }
  },
  created () {
    this.getSubjects()
  },
  methods: {
    // 页面一加载获取学科简单列表
    async getSubjects () {
      const { data: res } = await simple()
      this.subjectIDList = res
    },
    getScreenForm (formList) {
      this.screenForm = formList
      this.$nextTick(() => {
        this.$refs.SubTable.getBasisList()
      })
    }
  }
}
</script>

<style scoped lang='scss'>
.app-container {
  padding: 0 10px;
  margin: 10px 0;
}

</style>
